<template>
  <div class="input-select-wrapper">
    
    <div class="select-part">
      <el-select v-model="SelectValue" 
        placeholder="请选择"
        @change="handleSelect"
        >
        <el-option
          v-for="item in optionList"
          :key="item.id"
          :label="item.name"
          :value="item.id">
        </el-option>
      </el-select>
    </div>
    <div class="input-part">
      <el-input v-model="inputValue" 
        placeholder="请输入内容"
        type="textarea"
        :rows="2"
        ></el-input>
    </div>
  </div>
</template>

<script lang="ts">
import { defineComponent, ref } from '@vue/runtime-core';
import { Option } from '../../types/index'

export default defineComponent({
  name: 'InputSelect',
  setup() {
    const SelectValue = ref('')
    const optionList = <Option[]>[]
    const inputValue = ref('')

    const handleSelect = (e: string) => {
      console.log(e)
    }
    return {
      SelectValue,
      optionList,
      inputValue,
      handleSelect
    }
  }
})
</script>